import React from 'react'
import { useNavigate } from 'react-router'
// 数据
function IllnessData(illness: any) {
    const data = illness.illness
    const nav = useNavigate();

    // 防抖函数
    const debounce = (fn: any, delay = 1000) => {
        let timer: any = null;
        return function (...args: any) {
            if (timer) clearTimeout(timer);
            timer = setTimeout(() => {
                fn.apply(this, args)
            }, delay);
            return timer
        }
    }
    // 单个信息数据
    const handClick = debounce((item: any) => {
        console.log(item);
        nav('/knowledge/knowledgedetails', {
            state: {
                id: item.id,
                name: item.name,
                desc: item.desc,
                desc1: item.desc1,
                desc2: item.desc2,
            }
        })
    })
    // 全部内容数据
    const hangdChildclick = debounce((item: any) => {
        console.log(item.children);
        nav('/knowledge/viewall', {
            state: {
                id: item.id,
                name: item.name,
                desc: item.desc,
                desc1: item.desc1,
                desc2: item.desc2,
                children: item.children
            }
        });
    })
    return (
        <div>
            {
                data && data.map((item: any, index: number) => {
                    return (
                        <div key={index} className='illness-item'>
                            <div className='illness-title'>
                                <div className='illness-LeftBorder'></div>
                                <div className='illness-text'>{item.name}</div>
                                <div className='illness-All'
                                    onClick={() => {
                                        hangdChildclick(item)
                                    }}>
                                    {
                                        item.All
                                    }
                                </div>
                            </div>

                            {/* 内容 */}
                            <div className='illness-texts'>
                                {
                                    item.children && item.children.map((item: any, index: number) => {
                                        return (
                                            <div key={index} className='illness-tsends'>
                                                <div className='llness-name'
                                                    onClick={() => {
                                                        handClick(item)
                                                    }}
                                                >
                                                    {item.name}
                                                </div>
                                            </div>
                                        )
                                    })
                                }
                            </div>
                        </div>
                    )
                })
            }
        </div>
    )
}

export default IllnessData